﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SubstituteDriving.aspx.cs"
    Inherits="WISD.CarFriend.Web.Admin.OA.SubstituteDrivingManage.SubstituteDriving" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>酒后代驾管理</title>
    <link href="../../Content/CSS/ClientCSS/qlsale.css" rel="stylesheet" type="text/css" />
    <link href="../../Content/CSS/ClientCSS/Table.css" rel="stylesheet" type="text/css" />
    <script src="/Admin/Scripts/ClientScripts/Page.js" type="text/javascript"></script>
    <script src="/Admin/Scripts/ClientScripts/CodyyForm.js" type="text/javascript"></script>
    <script src="/Admin/Scripts/ClientScripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script src="/Admin/Scripts/DatePicker/WdatePicker.js" type="text/javascript"></script>
    
    <%-- TimePicker日期控件 --%>
    <link type="text/css" href="../../Scripts/TimePicker/css/jquery-ui-1.8.17.custom.css" rel="stylesheet" />
    <link type="text/css" href="../../Scripts/TimePicker/css/jquery-ui-timepicker-addon.css" rel="stylesheet" />
    <script type="text/javascript" src="../../Scripts/TimePicker/js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="../../Scripts/TimePicker/js/jquery-ui-1.8.17.custom.min.js"></script>
    <script type="text/javascript" src="../../Scripts/TimePicker/js/jquery-ui-timepicker-addon.js"></script>
    <script type="text/javascript" src="../../Scripts/TimePicker/js/jquery-ui-timepicker-zh-CN.js"></script>
</head>
<body>
    <div style="height: auto;">
        <table class="adduser" align="center" border="0" cellpadding="0" cellspacing="0"
            width="100%" bgcolor="#F2F7F5">
            <tbody>
                <tr>
                    <td colspan="2" class="bigTitle" height="40">
                        <strong>酒后代驾管理</strong>
                    </td>
                </tr>
                <tr>
                    <td class="sctitle" style="width: 81px;">
                        姓名：
                    </td>
                    <td>
                        <input id="txtName" class="xstxt" type="text" />
                    </td>
                </tr>
                <tr>
                    <td class="sctitle" style="width: 81px;">
                        车牌号：
                    </td>
                    <td>
                        <input id="txtVehicleNo1" class="xstxt" type="text" />
                    </td>
                </tr>
                <tr>
                    <td class="sctitle" style="width: 81px;">
                        状态：
                    </td>
                    <td>
                        <select id="SelState">
                            <option value="">--请选择状态--</option>
                            <option value="0">未审核</option>
                            <option value="1">已审核</option>
                            <option value="2">已完成</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td colspan="2" class="fenline">
                        &nbsp;
                        <input value="搜索" class="twobtn" type="button" id="btnSearch" />&nbsp;&nbsp;
                        <input class="twobtn" value="新增" type="button" id="btnAdd" />&nbsp;
                    </td>
                </tr>
                <tr>
                    <td colspan="2">
                        <table rules="all" class="tableStyle">
                            <thead>
                                <tr>
                                    <th scope="col">
                                        代驾编号
                                    </th>
                                    <th scope="col">
                                        姓名
                                    </th>
                                    <th scope="col">
                                        车牌号
                                    </th>
                                    <th scope="col">
                                        移动电话
                                    </th>
                                    <th scope="col">
                                        状态
                                    </th>
                                    <th scope="col">
                                        操作
                                    </th>
                                </tr>
                            </thead>
                            <tbody id="databody">
                            </tbody>
                            <tfoot id="footer" class="div_footer">
                            </tfoot>
                        </table>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
    <div id="registerdiv" class="registerdiv" style="width: 750px;">
        <table class="addTable" align="center" border="0" cellpadding="0" cellspacing="0"
            width="100%">
            <tbody>
                <tr class="topTitle">
                    <td colspan="4" style="margin-top: -3px;">
                        <ul>
                            <li class="leftli">添加酒后代驾信息</li>
                            <li class="rightli" onclick="$('#registerdiv').hide();">
                                <img alt="关闭" title="关闭" id="close" src="/Admin/Content/Images/tdClose_Hover.png" /></li>
                        </ul>
                    </td>
                </tr>
                <tr>
                    <td class="sctitle_four">
                        代驾编号：
                    </td>
                    <td>
                        <input id="txtDriveId" name="DriveId" class="stxt" type="text" readonly="readonly" />
                    </td>
                    <td class="sctitle_four">
                        代驾人员：
                    </td>
                    <td>
                        <select id="SelEmployeeId" style="width: 120px;">
                        </select>
                    </td>
                </tr>
                <tr>
                    <td class="sctitle_four">
                        姓名：
                    </td>
                    <td>
                        <input id="txtName1" name="Name" class="stxt" type="text" clear="yes" needcheck="yes"
                            reg="([\u4e00-\u9fa5]+|[a-zA-Z]+)" scope="1,50" tip="['姓名不能为空','只能为中英文','长度在1-50之间']" />
                        <span></span>
                    </td>
                    <td class="sctitle_four">
                        车牌号：
                    </td>
                    <td>
                        <input id="txtVehicleNo" name="VehicleNo" class="stxt" type="text" reg="^[\u4e00-\u9fa5]{1}[A-Z]{1}[A-Z_0-9]{5}$"
                            needcheck="yes" tip="['车牌号码不能为空','车牌号码规则：第一个必须是汉字，第二个必须是大写字母，后5个必须是大写字母或数字','长度在1-50之间']" scope="1,50" clear="yes" />
                        <span></span>
                    </td>
                </tr>
                <tr>
                    <td class="sctitle_four">
                        预约时间：
                    </td>
                    <td>
<%--                        <input id="txtReserveDate" name="ReserveDate" onclick="WdatePicker()" class="stxt"
                            type="text" reg="^\d{4}(\-|\/|\.)\d{1,2}\1\d{1,2}$" needcheck="yes" tip="['','预约时间只能是日期']"
                            clear="yes" allownull="yes" />--%>
                            <input id="txtReserveDate" name="ReserveDate"  class="stxt" type="text" clear="yes" needcheck="yes"
                            tip="['预约时间不能为空']" />
                        <span></span>
                    </td>
                    <td class="sctitle_four">
                        到达时间：
                    </td>
                    <td>
<%--                        <input id="Text1" name="ArriveDate" onclick="WdatePicker()" class="stxt"
                            type="text" reg="^\d{4}(\-|\/|\.)\d{1,2}\1\d{1,2}$" needcheck="yes" tip="['','预约时间只能是日期']"
                            clear="yes" allownull="yes" />--%>
                        <input id="txtArriveDate" name="ArriveDate" class="stxt" type="text" clear="yes" />
                        <span></span>
                    </td>
                </tr>
                <tr>
                    <td class="sctitle_four">
                        移动电话：
                    </td>
                    <td>
                        <input id="txtMobileTel" name="MobileTel" class="stxt" type="text" clear="yes" needcheck="yes"
                            reg="^(13|14|15|18)[0-9]{9}$" scope="1,50" tip="['移动电话不能为空','移动电话格式不对','长度在1-50之间']" />
                        <span></span>
                    </td>
                    <td class="sctitle_four">
                        里程数：
                    </td>
                    <td>
                        <input id="txtMileage" name="Mileage" class="stxt" type="text" clear="yes" needcheck="yes"
                            allownull="yes" reg="^\d*\.?\d+$" scope="0,50" tip="['','只能为数字','长度在0-50之间']" />
                        <span></span>
                    </td>
                </tr>
                <tr>
                    <td class="sctitle_four">
                        代驾地点：
                    </td>
                    <td colspan="3">
                        <textarea id="txtAddress" name="Address" cols="55" rows="3" clear="yes" style="overflow: hidden;
                            display: block; resize: none; margin-bottom: 5px;"></textarea>
                        <span></span>
                    </td>
                </tr>
                <tr>
                    <td class="sctitle_four">
                        代驾目的地：
                    </td>
                    <td colspan="3">
                        <textarea id="txtDestination" name="Destination" cols="55" rows="3" clear="yes" style="overflow: hidden;
                            display: block; resize: none; margin-bottom: 5px;"></textarea>
                        <span></span>
                    </td>
                </tr>
                <tr>
                    <td class="sctitle_four">
                        备注：
                    </td>
                    <td colspan="3">
                        <textarea id="txtRemarks" name="Remarks" cols="55" rows="3" clear="yes" style="overflow: hidden;
                            display: block; resize: none; margin-bottom: 5px;"></textarea>
                    </td>
                </tr>
                <tr>
                    <td class="sctitle" style="width: 81px;">
                        状态：
                    </td>
                    <td colspan="3">
                        <select id="SelState1">
                            <option value="0">未审核</option>
                            <option value="1">已审核</option>
                            <option value="2">已完成</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td colspan="4" style="height: 15px;">
                    </td>
                </tr>
                <tr>
                    <td colspan="4" align="center" style="text-align: center;">
                        <input value="修改" id="btnEdit" class="twobtn" type="button" />&nbsp;&nbsp;
                        <input value="保存" id="btnSave" class="twobtn" type="button" />&nbsp;&nbsp;
                        <input id="btnRest" class="twobtn" value="重置" type="button" />
                    </td>
                </tr>
                <tr>
                    <td colspan="4" style="height: 15px;">
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</body>
</html>
<script type="text/javascript">

    //赋值操作
    function EditEntity() {
        var rs = Page.Static.Rs[0];
        $("#txtName1").val(rs["Name"]);
        $("#txtVehicleNo").val(rs["VehicleNo"]);
        $("#txtAddress").val(rs["Address"]);
        $("#txtDestination").val(rs["Destination"]);
        $("#txtMileage").val(rs["Mileage"]);
        $("#txtMobileTel").val(rs["MobileTel"]);
        $("#txtRemarks").val(rs["Remarks"]);
        $("#txtDriveId").val(rs["DriveId"]);
        $("#txtReserveDate").val(rs["ReserveDate"]);
        $("#txtArriveDate").val(rs["ArriveDate"]);
        $("#SelEmployeeId").val(rs["EmployeeId"]);
    };

    //专门用来保存某个记录的详细消息
    var rs = {};

    $(function () {
        var MainPK = "";
        var Condition = "";
        var CurrentPage = 1;

        //失去焦点验证
        Form.Blur({ id: "registerdiv" });

        //添加修改记录
        var setEntity = function (obj) {
            var Result = Form.Validator({ id: "registerdiv" });
            if (Result) {
                var _$ = function (id) { return document.getElementById(id); };
                var data = {
                    Action: obj.Action
                      , Name: $.trim($("#txtName1").val())
                      , VehicleNo: $.trim($("#txtVehicleNo").val())
                      , Address: $.trim($("#txtAddress").val())
                      , Destination: $.trim($("#txtDestination").val())
                      , Mileage: $.trim($("#txtMileage").val())
                      , MobileTel: $.trim($("#txtMobileTel").val())
                      , Remarks: $.trim($("#txtRemarks").val())
                      , State: $.trim($("#SelState1").val())
                      , DriveId: $.trim($("#txtDriveId").val())
                      , ReserveDate: $.trim($("#txtReserveDate").val())
                      , ArriveDate: $.trim($("#txtArriveDate").val())
                      , EmployeeId: $.trim($("#SelEmployeeId").val())
                };
                if (obj.Action == "EditEntity") { data["Main"] = obj.Main; }
                $.post("/Admin/Control/SubstituteDriving.ashx", data, function (data) {
                    if (data.split(",")[0] === "Success") {
                        if (obj.Action == "AddEntity") {
                            alert("添加成功!");
                            Condition = GetCondition();
                            CurrentPage = Page.Static.CurrentPage;
                            InitPage();
                        }
                        else {
                            alert("修改成功!");
                            Condition = GetCondition();
                            CurrentPage = Page.Static.CurrentPage;
                            InitPage();
                        }
                    }
                    else {
                        obj.Action == "AddEntity" ? alert("添加失败！") : alert("修改失败!"); ;
                    }
                });
            }
        }

        //获取查询条件
        var GetCondition = function () {
            var Name = $("#txtName").val() || "null";
            var State = $("#SelState").val() || "null";
            var VehicleNo = $("#txtVehicleNo1").val() || "null";
            return Name + "@" + State + "@" + VehicleNo;
        };

        //加载数据
        var InitPage = function () {
            Page.GetData({ "Control": "/Admin/Control/SubstituteDriving.ashx", "Action": "Init", "first": true, "colspan": 50, "Condition": Condition, "CurrentPage": CurrentPage, "databody": "databody", "footer": "footer" });
        };

        //第一次加载数据
        Condition = GetCondition();
        InitPage();

        //重置表单
        var ResetForm = function () {
            $(".addTable").find("input[type='text'][clear='yes'],textarea[clear='yes']").val("");
            $(".addTable").find("input,textarea,select").attr("disabled", false);
        };

        //点击搜索按钮
        $("#btnSearch").click(function () {
            Condition = GetCondition();
            CurrentPage = 1;
            InitPage();
        });

        //点击新增按钮
        $("#btnAdd").click(function () {
            ResetForm();
            GetDriveId();
            LoadExmployee();
            $("#btnSave,#btnRest").show();
            $("#btnEdit").hide();
            $(".leftli").html("添加员工信息");
            Page.divCenter($("#registerdiv")[0]);
        });

        //点击保存按钮
        $("#btnSave").click(function () {
            setEntity({ "Action": "AddEntity" });
        });

        //点击重置按钮
        $("#btnRest").click(function () {
            ResetForm();
        });

        //点击修改按钮
        $("#btnEdit").click(function () {
            setEntity({ "Action": "EditEntity", "Main": MainPK });
        });

        //在Table中点击修改、删除 
        $("#databody").click(function (e) {
            var that = this;
            var e = e || window.event;
            var target = e.srcElement || e.target;
            if ($(target).is("a")) {
                var action = $(target).attr("action");
                var main = $(target).parent().parent().attr("main");
                MainPK = main;
                if (!action.localeCompare("edit")) {    //编辑
                    ResetForm();
                    LoadExmployee();
                    $("#btnSave,#btnRest").hide();
                    $("#btnEdit").show();
                    //$("#txtName").attr("disabled", true);
                    $(".leftli").html("修改酒后代驾信息");
                    var divobj = $("#registerdiv");
                    Page.divCenter(divobj[0]).GetOne({ "Main": main });
                }
                if (!action.localeCompare("delete")) {    //删除
                    if (confirm("是否确定删除该记录?")) {
                        Page.DeleteEntity({ "Main": main });
                    }
                }
                (! -[1, ]) ? e.cancelBubble = true : e.stopPropagation();
            }
        }).dblclick(function (e) {    //双击查看详细信息
            var that = this;
            var e = e || window.event;
            var target = e.srcElement || e.target;
            if ($(target.parentNode).is("tr")) {
                var main = $(target.parentNode).attr("main");
                ResetForm();
                LoadExmployee();
                $("#btnEdit,#btnSave,#btnRest").hide();
                $(".addTable").find("input,textarea,select").attr("disabled", true);
                $(".leftli").html("酒后代驾详细信息");
                var divobj = $("#registerdiv");
                Page.divCenter(divobj[0]).GetOne({ "Main": main });
                (! -[1, ]) ? e.cancelBubble = true : e.stopPropagation();
            }
        });


        //获取代驾编号
        var GetDriveId = function () {
            $.post("/Admin/Control/SubstituteDriving.ashx", { Action: "GetDriveId" }, function (data) {
                $("#txtDriveId").val(data);
            });
        };

        //获取员工信息
        var LoadExmployee = function () {
            $.post("/Admin/Control/SubstituteDriving.ashx", { "Action": "GetEmployee" }, function (data) {
                if (!data) {
                    $("#SelEmployeeId").html("<option value='-1'>无</option>");
                    return;
                }
                var jsonArr = eval("(" + data + ")");
                var selstr = "";
                for (var i = 0; i < jsonArr.length; i++) {
                    selstr += "<option value=" + jsonArr[i]["EmployeeID"] + ">" + jsonArr[i]["Name"] + "</option>";
                }
                $("#SelEmployeeId").html(selstr).change();
            });
        };

        $("#txtReserveDate,#txtArriveDate").datetimepicker({
            //showOn: "button",
            //buttonImage: "./css/images/icon_calendar.gif",
            //buttonImageOnly: true,
            showSecond: true,
            timeFormat: 'hh:mm:ss',
            stepHour: 1,
            stepMinute: 1,
            stepSecond: 1
        });

    });
</script>
